<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>火焰检测首页</title>
    <script src="js/jquery-3.1.1.min.js"></script>
    <script src="js/vue.js"></script>
        <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
        <style>
		.index{
		  background-image:url(image/index.jpg);
		  background-size: cover;
		  background-repeat:no-repeat;
          background-position: 0% 0%;
		  overflow:hidden;
		  height: 100%;
		}
		</style>
</head>
	<body class="index">
		<div id="myApp">
            <div style="position: fixed;top:20%;left:40%;">
                      <h1 align="center" style="color:#66CCFF">火焰识别系统</h1>
					     
            </div>

            <el-card style="position: fixed;left:12%;top:50%;width: 500px">
                <div slot="header" >
                    <el-button type="primary"  round @click="detect_img">图片检测</el-button>
                </div>
                <div class="text item">
                    <span>这里是图片检测功能</span>
                </div>
                <div class="text item">
                    <span>火焰检测模型</span>
                </div>
            </el-card>

            <el-card style="position: fixed;left:55%;top:50%;width: 500px">
                <div slot="header" >
                    <el-button type="primary"  round  @click="detect_video">视频检测</el-button>
                </div>
                <div class="text item">
                    <span>这里是视频检测功能</span>
                </div>
                <div class="text item">
                    <span>火焰检测模型</span>
                </div>
            </el-card>
		</div>

	</body>
<script>
     new Vue({
         el:"#myApp",//绑定元素
         methods:{
              detect_img(){
                  window.location.href="/static/detect_img.html";
              },
             detect_video(){
                  window.location.href="/static/detect_video.html";
             }
         }
     })
</script>

</html>